<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>video</title>
<!-- <link rel="stylesheet" type="text/css" href="./videojs/video-js.min.css" /> -->
<style>
    * {
        margin: 0;
        padding: 0;
        border: 0;
    }
    body, html, #videoBox {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }
    #test_video {
        width: 100%;
        height: 100%;
    }

</style>
</head>
<body>
<div id="videoBox">
    
</div>



</body>
</html>
<script type="text/javascript" src="jquery-1.9.js"></script>
<script type="text/javascript" src="./ckplayer/ckplayer.js"></script>

<script>
var n = 0
var id = ''
function UrlSearch() {
   var name,value; 
   var str=location.href; //取得整个地址栏
   var num=str.indexOf("?") 
   str=str.substr(num+1); //取得所有参数   stringvar.substr(start [, length ]

   var arr=str.split("&"); //各个参数放到数组里
   for(var i=0;i < arr.length;i++){ 
        num=arr[i].indexOf("="); 
        if(num>0){ 
            name=arr[i].substring(0,num);
            value=arr[i].substr(num+1);
            this[name]=value;
        } 
    } 
} 


var Request=new UrlSearch();
var player = {}
function start() {
    var rtsp = Request.rtsp || ''
        rtsp.replace(/\+/g,"/")
        rtsp.replace(/--/g,":")
        rtsp.replace(/,/g,".")
    $.ajax({
        type:"post",
        data:{url: rtsp || "rtsp://admin:xalt12345@10.103.0.10:554/h264/ch1/sub/av_stream"},
        url:"/streamOption/startStream",  
        success: function(dat){
            if (dat.status == 1) {
                start()
                return
            }
            $("#videoBox").html("")
            setTimeout(function(){
                // $("#videoBox").html('<video id="test_video" class="video-js vjs-default-skin vjs-big-play-centered" controls autoplay>\
                //     <source src="'+dat.dataMap.url+'" type="rtmp/flv" />\
                // </video>')
                // videojs.options.flash.swf = "./videojs/video-js.swf"
                // player = videojs('test_video', {"autoplay":true,flash:{
                //     swf: "./videojs/video-js.swf",
                //     hls: { withCredentials: false }
                // }}, function onPlayerReady() {
                //     this.play()
                // });
                // id = dat.dataMap.timeId
                // window.parent.postMessage({id:id},'*');
                // setInterval(function() {
                //     player.load(dat.dataMap.url); //重新加载 
                //     player.play()
                // }, 3*60*1000)
                // 
                var videoObject = {
                container: '#videoBox', //容器的ID或className
                variable: 'player', //播放函数名称
                //loop: true, //播放结束是否循环播放
                autoplay: true,//是否自动播放
                flashplayer:true,
                live:true,
                video: dat.dataMap.url
            };
            var player = new ckplayer(videoObject);



                // var flashvars={
                //     f:dat.dataMap.url,
                //     c:0,
                //     b:1
                // };
                // var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'};
                // CKobject.embedSWF('./ckplayer/ckplayer.swf','videoBox','videoBox','100%','100%',flashvars,params);
            }, 100)
        }
    });
}

start()


function stop() {
    if(!id) return
    $.ajax({
        type:"post",
        data:{timeId: id},
        url:"/streamOption/shutdownStream",  
        success: function(dat){
            console.log(dat)
        }
    });
}

// 心跳
function heartbeat() {
    $.ajax({
        type:"post",
        data:{timeId: id},
        url:"/streamOption/heartbeat",  
        success: function(dat){
            if (dat == "心跳更新失败！") {
                location.replace(location)
            }
        }
    });
}

var heartbeattimer = setInterval(heartbeat, 20 * 1000)

window.onunload = window.onbeforeunload = function(){
    player.dispose()
    stop()
    clearInterval(heartbeattimer)
}
</script>
